<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> 
<meta name="keywords" content="carousel, jquery, responsive, fluid, elastic, resize, thumbnail, slider" />
<meta name="author" content="Codrops" />
<title>微评说客</title>
<link rel="stylesheet" type="text/css" href="style/public.css">
<link rel="stylesheet" type="text/css" href="style/style.css">
<link rel="stylesheet" type="text/css" href="style/font-awesome.css">
<link rel="stylesheet" type="text/css" href="style/elastislide.css">
</head>

<body>
<header class="index-header">
	<h1>微评</h1>
</header>
<article>
  <!--scroll-->
  <div class="scroll relative">
    <div class="scroll_box" id="scroll_img">
        <ul class="scroll_wrap">
          <li><a href="#"><img src="images/img1.gif" width="100%" alt=""></a></li>
          <li><a href="#"><img src="images/img1.gif" width="100%" alt=""></a></li>
          <li><a href="#"><img src="images/img1.gif" width="100%" alt=""></a></li>
        </ul>
    </div>
  <ul class="scroll_position" id='scroll_position'>
      <li class="on"><a href="javascript:void(0);">1</a></li>
      <li><a href="javascript:void(0);">2</a></li>
      <li><a href="javascript:void(0);">3</a></li>
  </ul>
  </div>
  <!--scroll-->
</article>
<section class="eq1">
	<a href="#">
        <div class="eq1-title">
            <img src="images/con-1.gif" alt="">
        </div>
        <div class="eq1-con">
            <h2>中秋月饼您一般喜欢什么</h2>
            <p>本次调查目的在于了解当下人们年对中秋节的认识与看法。耽误您宝贵的时间，再次向你致谢！</p>
        </div>
        <div class="eq1-bottom">
             <p><strong>400</strong><i><img src="images/right-icon1.gif" alt=""></i><b>50000</b><i><img src="images/right-icon3.gif" alt=""></i><div class="clears"></div></p>
        </div>
    </a>
</section>
<section class="eq1">
	<a href="#">
        <div class="eq1-title">
            <img src="images/con-1.gif" alt="">
        </div>
        <div class="eq1-con">
            <h2>中秋月饼您一般喜欢什么</h2>
            <p>本次调查目的在于了解当下人们年对中秋节的认识与看法。耽误您宝贵的时间，再次向你致谢！</p>
        </div>
        <div class="eq1-bottom">
             <p><strong>400</strong><i><img src="images/right-icon1.gif" alt=""></i><b>50000</b><i><img src="images/right-icon3.gif" alt=""></i><div class="clears"></div></p>
        </div>
    </a>
</section>
<script type="text/javascript" src="jquery/jquery-1.7.2.min.js"></script>
<script src='jquery/hhSwipe.js'></script>
<script>
var slider = Swipe(document.getElementById('scroll_img'), {
	auto: 2000,
	continuous: true,
	callback: function(pos) {
		var i = bullets.length;
		while (i--) {
			bullets[i].className = ' ';
		}
		bullets[pos].className = 'on';
	}
});
var bullets = document.getElementById('scroll_position').getElementsByTagName('li');
$(function(){
	$('.scroll_position_bg').css({
		width:$('#scroll_position').width()
	});
});
</script>
</body>
</html>
